import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:geomancy/styles/index.dart';
import 'package:geomancy/widgets/common_btn.dart';
import 'package:geomancy/widgets/common_header.dart';
import 'package:go_router/go_router.dart';
import 'package:pinput/pinput.dart';

import '../../tools/constant.dart';

class CodeInputPage extends StatefulWidget {
  const CodeInputPage({super.key});

  @override
  State<CodeInputPage> createState() => _CodeInputPageState();
}

class _CodeInputPageState extends State<CodeInputPage> {
  late final TextEditingController pinController;

  @override
  void initState() {
    super.initState();
    pinController = TextEditingController();
  }

  Future sendCodeHandle() async {
    /// 使用go，不让他返回登录界面了
    context.go('/register_nickname');
  }

  @override
  Widget build(BuildContext context) {
    final defaultPinTheme = PinTheme(
      width: 132.w,
      height: 142.w,
      textStyle: TextStyle(
        fontSize: 36.sp,
        color: ColorStyle.textColor,
      ),
      decoration: BoxDecoration(
          color: ColorStyle.themeLightColor,
          border: Border.all(width: 5.w, color: ColorStyle.borderColor),
          borderRadius: BorderRadius.all(Radius.circular(50.w))
      ),
    );

    return Scaffold(
      appBar: CommonHeader.appBar(context: context),
      backgroundColor: ColorStyle.pageDefaultColor,
      resizeToAvoidBottomInset: false,
      body: GestureDetector(
        behavior: HitTestBehavior.translucent,
        onTap: () {
          FocusScope.of(context).requestFocus(FocusNode());
        },
        child: Container(
          width: double.infinity,
          padding: EdgeInsets.fromLTRB(80.w, 170.w, 80.w, 80.w),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Column(
                children: [
                  Text('输入验证码', style: TextStyle(fontSize: 36.sp, color: ColorStyle.textColor, fontWeight: FontWeight.w400)),
                  Text('已发送验证码至199****9999', style: TextStyle(fontSize: 30.sp, color: ColorStyle.textColor)),
                  SizedBox(height: 100.w),
                  Pinput(
                    controller: pinController,
                    separatorBuilder: (index) => SizedBox(width: 21.w),
                    defaultPinTheme: defaultPinTheme,
                    autofillHints: const [AutofillHints.oneTimeCode],
                    length: 4,
                    toolbarEnabled: false,
                    onCompleted: (pin) {
                      debugPrint('onCompleted: $pin');
                    },
                  ),
                ],
              ),
              Container(
                height: 220.w,
                alignment: Alignment.topCenter,
                child: CommonBtnWidget(txt: '重新发送', onTap: sendCodeHandle),
              )
            ],
          ),
        ),
      ),
    );
  }
}

